/*
 * @Author: songjian
 * @Date: 2018-11-05 15:09:17
 * @Last Modified by: songjian
 * @Last Modified time: 2018-11-07 09:52:49
 */

import React from 'react';
import { Link } from 'react-router-dom';
import { renderRoutes } from 'react-router-config';
import { Layout, Menu } from 'antd';

const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;

export default class Shops extends React.Component {
  state = {
    menuItemTitle: [ '店铺装修', '自定义分组' ],

  }
  handleClick = e => {
    console.log('itemKey ', e.key);
  }

  render() {
    return (
      <Layout style={{ height: '100%' }} hasSider>
        <Layout.Sider
          width={152}
          style={{
            overflow: 'auto',
            height: '100%',
            backgroundColor: '#fff',
          }}
        >
          <Menu
            onClick={this.handleClick}
            defaultSelectedKeys={ [ 'customGroup' ] }
            defaultOpenKeys={ [ 'sub1' ] }
            mode="inline"
          >
            <SubMenu key="sub1" title="店铺管理">
              <Menu.Item key="shopDecoration"><Link to='/seller/shop/shopDecoration'>店铺装修</Link></Menu.Item>
              <Menu.Item key="customGroup"><Link to='/seller/shop/customGroup'>自定义分组</Link></Menu.Item>
            </SubMenu>
          </Menu>
        </Layout.Sider>
        <Layout>
          <Layout.Content style={{ overflow: 'auto', height: '100%' }}>
            {renderRoutes(this.props.route.routes)}
          </Layout.Content>
        </Layout>
      </Layout>
    );
  }
}
